<template>
  <div id="my" class="about">
    <p>
      <MultiSelect v-model="selectedCars" :options="cars" optionLabel="brand" placeholder="Select Brands" />
    </p>
  </div>
</template>

<script>
  import MultiSelect from 'primevue/multiselect';


export default {
  el: '#my',
  components: {
    MultiSelect
  },
  data() {
      return {
        selectedCars: null,
        cars: [
          {brand: 'Audi', value: 'Audi'},
          {brand: 'BMW', value: 'BMW'},
          {brand: 'Fiat', value: 'Fiat'},
          {brand: 'Honda', value: 'Honda'},
          {brand: 'Jaguar', value: 'Jaguar'},
          {brand: 'Mercedes', value: 'Mercedes'},
          {brand: 'Renault', value: 'Renault'},
          {brand: 'Volkswagen', value: 'Volkswagen'},
          {brand: 'Volvo', value: 'Volvo'}
        ]
      }
    }
  }
</script>

